
<template>
  <div>
    <van-cell-group>
      <van-field
        v-model="value"
        :label="label"
        :placeholder="tips"
        :type="type"
        :rule="rule"
      />
    </van-cell-group>
  </div>
</template>

<script>
export default {
  data() {
    return {
      value: "",
    };
  },
  props: {
    label: {
      type: String,
    },
    type: {
      type: String,
    },
    rule: {
      type: String,
    },
  },
  computed: {
    tips() {
      return "请输入" + this.label;
    },
  },
  methods: {
    regexData(data) {
      const rule = new RegExp(this.rule);
      //   console.log(rule);
      if (rule.test(this.value)) {
        // console.log("满足了正则");
        this.$emit("inputChange", this.value);
      } else {
        this.$emit("inputChange", "error");
      }
    },
  },
  watch: {
    value(newValue, oldValue) {
      this.regexData(newValue);
    },
  },
};
</script>

<style lang="less" scoped></style>
